// 新建bem架构规则
$namespace: "jc" !default;
$block-sel: "-" !default;
$elem-sel: "__" !default;
$mod-sel: "--" !default;

// 块级
@mixin b($block) {
  $B: #{$namespace + $block-sel + $block};
  .#{$B} {
    // 占位符，相当于插槽
    @content;
  }
}

// 元素
@mixin e($el) {
  $selector: &;
  // 跳出嵌套
  @at-root {
    #{$selector + $elem-sel + $el} {
      // 占位符，相当于插槽
      @content;
    }
  }
}

// 修饰符
@mixin m($m) {
  $selector: &;
  @at-root {
    #{$selector + $mod-sel + $m} {
      @content;
    }
  }
}

// Block Formatting Context,块格式上下文;
// BFC 可以理解为一个容器，里面的元素不会影响到容器外的布局
@mixin bfc {
  height: 100%;
  overflow: hidden;
}
